<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>jdbc数据库操作监控</title>
    <link type="text/css" rel="stylesheet" th:href="@{${skinPath} + '/css.css'}"/>
    <style>
        .content {
            margin: 20px;
        }
        .content div {
            margin: 20px;
        }
    </style>
    <script th:src="@{/inc/common.js}"></script>
    <script th:src="@{/js/jquery-3.7.1.min.js}"></script>
    <script type="text/javascript" th:src="@{/js/jquery.editinplace.js}"></script>
    <script type="text/javascript" th:src="@{/js/jquery.toaster.js}"></script>
    <script th:src="@{/js/layui/layui.js}" charset="utf-8"></script>
    <link th:href="@{/js/jquery-showLoading/showLoading.css}" rel="stylesheet" media="screen"/>
    <script type="text/javascript" th:src="@{/js/jquery-showLoading/jquery.showLoading.js}"></script>
    <link rel="stylesheet" th:href="@{/js/layui/css/layui.css}" media="all">
    <script th:src="@{/js/jquery-alerts/jquery.alerts.js}" type="text/javascript"></script>
    <script th:src="@{/js/jquery-alerts/cws.alerts.js}" type="text/javascript"></script>
    <link th:href="@{/js/jquery-alerts/jquery.alerts.css}" rel="stylesheet" type="text/css" media="screen"/>
</head>
<body>
<div class="content">
    <div>未关闭的连接&nbsp;&nbsp;(<a href="javascript:;" th:onclick="done('clearActiveConn')">清空</a>)</div>
    <th:block th:each="cd : ${aryNotClosed}">
        <div th:id="${'conn' + cd.threadName}">
            <div><img th:id="${'stackImg' + cd.threadName}" style="cursor:pointer" src="../images/i_plus.gif"
                      th:onclick="loadStackTrace([[${cd.threadName}]])">&nbsp;&nbsp;[[${cd.threadName}]]&nbsp;&nbsp;[[${cd.time}]]&nbsp;&nbsp;已连接：[[${cd.connTime}]]秒&nbsp;&nbsp;<a
                    href="javascript:;" th:onclick="done('remove', '[(${cd.connId})]')">删除</a></div>
            <div th:id="${'stack' + cd.threadName}" style="display:none">
                [(${cd.stack})]<br>
            </div>
        </div>
    </th:block>
    <div>当前状态：[[${status}]]</div>
    <div><a href="javascript:;" th:onclick="done('setDebug', true)">置为调试状态</a></div>
    <div><a href="javascript:;" th:onclick="done('setDebug', false)">退出调试状态</a></div>
    <div>慢查询 (<a href="javascript:;" th:onclick="done('clearTooLongQueries')">清空</a>)</div>
    <div>超时<input id="maxElapseTime" style="width: 50px" th:value="${maxElapseTime}">毫秒&nbsp;<input type="button" class="btn btn-default" value="确定" th:onclick="done('setMaxElapseTime', $('#maxElapseTime').val())"> </div>
    <th:block th:each="cd, stat : ${aryLowQuery}">
        <div th:id="'connTooLong' + ${cd.threadName}">
            <div>
                <div><img th:id="'stackTooLongImg' + ${cd.threadName} + ${stat.index}" style="cursor:pointer" src="../images/i_plus.gif"
                          th:onclick="loadStackTraceTooLong('[(${cd.threadName})]', '[(${stat.index})]')">&nbsp;&nbsp;[[${cd.threadName}]]&nbsp;&nbsp;[[${cd.time}]]&nbsp;&nbsp;
                    <a href="javascript:;" th:onclick="done('removeTooLong', '[(${cd.connId})]')">删除</a></div>
                <div>[[${cd.sql}]]&nbsp;&nbsp;[[${cd.queryTimeElapse}]]秒</div>
            </div>
            <div th:id="'stackTooLong' + ${cd.threadName} + ${stat.index}" style="display:none">
                [(${cd.stack})]<br>
            </div>
        </div>
    </th:block>
    <div>
    <input type="button" value="后退" class="btn btn-default" onclick="window.location.href='tools'"/>
    </div>
</div>
<script th:inline="javascript">
    function loadStackTrace(tId) {
        var targetImg2 = $("#stackImg" + tId)[0];
        var targetTR2 = $("#stack" + tId)[0];
        if ("object" == typeof (targetImg2)) {
            if (targetTR2.style.display != "") {
                targetTR2.style.display = "";
                targetImg2.src = "../images/i_minus.gif";
            } else {
                targetTR2.style.display = "none";
                targetImg2.src = "../images/i_plus.gif";
            }
        }
    }

    function loadStackTraceTooLong(tId, stat) {
        var targetImg2 = $("#stackTooLongImg" + tId + stat)[0];
        var targetTR2 = $("#stackTooLong" + tId + stat)[0];
        console.log('targetTR2', targetTR2, 'targetImg2', targetImg2);
        if ("object" == typeof (targetImg2)) {
            if (targetTR2.style.display != "") {
                targetTR2.style.display = "";
                targetImg2.src = "../images/i_minus.gif";
            } else {
                targetTR2.style.display = "none";
                targetImg2.src = "../images/i_plus.gif";
            }
        }
    }

    function done(op, param) {
        layer.confirm('确定要操作么？', {icon: 3, title: '提示'}, function (r) {
            layer.close();

            if (r) {
                $.ajax({
                    type: "post",
                    url: "./connMonitorDo",
                    contentType: "application/x-www-form-urlencoded; charset=iso8859-1",
                    data: {
                        op: op,
                        connHashCode: param,
                        isDebug: param,
                        maxElapseTime: param,
                    },
                    dataType: "json",
                    beforeSend: function (XMLHttpRequest) {
                        $('body').showLoading();
                    },
                    success: function (res, status) {
                        console.log('res', res);
                        layer.msg(res.msg, {
                            offset: '6px'
                        });
                        if (res.code == 200)
                            window.location.reload();
                    },
                    complete: function (XMLHttpRequest, status) {
                        $('body').hideLoading();
                    },
                    error: function (XMLHttpRequest, textStatus) {
                        // 请求出错处理
                        alert(XMLHttpRequest.responseText);
                    }
                });
            }
        });
    }
</script>
</body>
</html>
